<#include "/common/defaultEngine.html"/>
<@pageTheme mark="${config.optimize()?string('true', 'false')}">
<@header title="OA请假单列表" libs=["table"]/>

    <style>
        body{padding:0;margin:0;width:100%;height:100%;background-color:#fff !important;}
        body>div{width:100%;height:100%;overflow: hidden;}
        .oa-form{width:100%;height:100%;position:relative;}
        .oa-form .form-top{width:100%;height:40px;border-bottom: 1px solid #ccc;}
        .oa-form .form-bottom{position:absolute;left:0;right:0;top:40px;bottom:0;}

        .oa-form .form-bottom .form-bottom-left{float:left;width:75%;height:100%;position:relative;border-right:1px solid #ccc;}
        .oa-form .form-bottom .form-bottom-right{float:right;width:25%;height:100%;}

        .oa-form .form-bottom .form-bottom-left .form-content{position:absolute;left:0;right:0;bottom:60px;top:0;}
        .oa-form .form-bottom .form-bottom-left .form-title{width:100%;height:109px;border-bottom:1px solid #ccc;}
        .oa-form .form-bottom .form-bottom-left .form-main{position:absolute;top:110px;left:0;right:0;bottom:0;}
        .oa-form .form-bottom .form-bottom-left .form-attach{position:absolute;left:0;right:0;bottom:0;
            height:60px;border-top:1px solid #ccc;}
        .oa-form .form-bottom .form-bottom-left .form-attach.expand{height:130px;}

        table.table-form-title td{padding:5px 2px !important;}
    </style>
    <div class="oa-form">
        <div class="form-top" style="margin-top:8px;padding-left:20px;">
            <button class="btn btn-info btn-rounded btn-sm">
                <i class="fa fa-save" style="padding-right:5px;"></i>保存待发
            </button>
            <button class="btn btn-info btn-rounded btn-sm">
                <i class="fa fa-plus-square" style="padding-right:5px;"></i>调用模板
            </button>
            <button class="btn btn-info btn-rounded btn-sm">
                <i class="fa fa-save" style="padding-right:5px;"></i>存为模板
            </button>
            <button class="btn btn-info btn-rounded btn-sm">
                <i class="fa fa-print" style="padding-right:5px;"></i>打印
            </button>
        </div>
        <div class="form-bottom">
            <div class="form-bottom-left">
                <div class="form-content">
                    <div class="form-title">

                        <table style="width:100%;" class="table table-no-bordered table-form-title">
                            <tr>
                                <td width="10%" rowspan="2" style="text-align:center;border-bottom:0 !important;">
                                    <button style="padding:20px 30px;" class="btn btn-danger btn-rounded btn-sm">发 送</button>
                                </td>
                                <td width="6%" style="text-align:right;border-bottom:0 !important;">项目：</td>
                                <td width="34%" style="border-bottom:0 !important;">
                                    <@f.input name="username" placeholder="请输入处理意见"  required=true/>
                                </td>
                                <td width="15%" style="border-bottom:0 !important;">
                                    <@f.select name="status" dictType="sys_pro_status" blankValue=""/>
                                </td>
                                <td width="10%" style="text-align:right;border-bottom:0 !important;">
                                    关联项目：
                                </td>
                                <td style="border-bottom:0 !important;">
                                    <@f.select name="status" dictType="sys_pro_status" blankValue="" blankLabel="所有"/>
                                </td>
                            </tr>
                            <tr>
                                <td style="text-align:right;border-bottom:0 !important;">流程：</td>
                                <td style="border-bottom:0 !important;">
                                    <@f.input name="username" placeholder="请输入处理意见" required=true/>
                                </td>
                                <td style="border-bottom:0 !important;">
                                    <@f.select name="status" dictType="sys_pro_status" blankValue="" blankLabel="所有"/>
                                </td>
                                <td style="text-align:right;border-bottom:0 !important;">
                                    <span>预归档到：</span>
                                </td>
                                <td style="border-bottom:0 !important;">
                                    <@f.select name="status" dictType="sys_pro_status" blankValue="" blankLabel="所有"/>
                                </td>
                            </tr>
                            <tr>
                                <td style="border-bottom:0 !important;"></td>
                                <td style="text-align:left;border-bottom:0 !important;" colspan="3">
                                    <i class="fa icon-link"></i><a>上传附件</a>
                                </td>
                            </tr>
                        </table>

                    </div>
                    <div class="form-main" style="background-color:#fff;overflow-x:hidden;overflow-y: auto;">

                        <#include "form01.html"/>

                    </div>
                </div>
                <div class="form-attach">
                    <div style="width:90%;margin:-1px auto 0;background-color:#ccc;">
                        <div class="button-attach" style="height:50px;line-height:50px;font-size:14px;background-color:#ccc;">
                            <i style="padding:0 5px 0 10px;" class="icon-attach fa fa-angle-double-down"></i>附言
                        </div>
                        <div style="width:99%;margin:0 auto;">
                            <textarea placeholder="2000字以内" style="border:1px solid #ddd;width:100%;height:70px;"></textarea>
                        </div>
                    </div>
                </div>
            </div>
            <div class="form-bottom-right" style="background-color: white;">
                <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
                    <ul class="layui-tab-title">
                        <li class="layui-this">相关数据</li>
                        <li>流程预测</li>
                    </ul>
                    <div class="layui-tab-content">
                        <div class="layui-tab-item layui-show">暂无相关数据</div>
                        <div class="layui-tab-item">暂无流程预测</div>
                    </div>
                </div>
            </div>
        </div>
    </div>

</div>
<@footer>
<script type="text/javascript">
    $(".button-attach").click(function () {
        $(".form-attach").toggleClass("expand");
        $(".icon-attach").toggleClass("fa-angle-double-up").toggleClass("fa-angle-double-down");
    });
    layui.use('element', function(){
        var element = layui.element;

        //…
    });
</script>
</@footer>
</@pageTheme>